<template>
  <transition name="move">
    <div v-show="showFlag" class="add" ref="addressInfo">
      <v-top :name="title"></v-top>
    </div>
  </transition>
</template>

<script>
  import Top from 'components/pageTop/top';

  export default {
    name: 'add',
    components: {
      'v-top': Top
    },
    props: {
      showFlag: {
        type: Boolean,
        default: false
      }
    },
    data() {
      return {
        title: '添加地址'
      };
    },
    methods: {
      initShow() {
        this.showFlag = true;
      }
    }
  }
  ;
</script>

<style scoped>
  .add {
    position: fixed;
    top: 0;
    left: 0;
    transition: all 0.3s;
    background: #fff;
    width: 100%;
    height: 100%;

  }

  .move-enter-active {
    transform: translate3d(0, 0, 0)
  }

  .move-enter, .move-leave-to {
    transform: translate3d(100%, 0, 0)
  }
</style>
